<template>
  <!-- 保安人员 -->
  <el-dialog title="填写计划" :visible.sync="showFurther" width="60%" :before-close="closeFurther" :close-on-click-modal="false">
    <el-form :model="formData.model" :rules="formData.rules" ref="form" label-width="150px" size="small" label-position="right">
      <el-row>
        <el-col :span="12">
          <el-form-item label="事项">
            <el-select v-model="formData.model.shixiang" placeholder="请选择" clearable>
              <el-option v-for="item in shixiangList" :key="item.primaryKey" :label="item.projectName" :value="item.primaryKey"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="总成本">
            <el-input-number v-model="formData.model.chengben" :min="0"></el-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="付款方式">
            <el-select v-model="formData.model.fukuan" placeholder="请选择" clearable>
              <el-option v-for="item in fukuanList" :key="item.primaryKey" :label="item.projectName" :value="item.primaryKey"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="首次付款时间">
            <el-date-picker v-model="formData.model.seeHouseTime" type="datetime" placeholder="选择日期时间"> </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="附件">
            <span class="addSpan">上传附件</span>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="提示">
            <span class="textSpan">此事项本财年计划支出 高于 上一财年年支出 29万元</span>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="说明">
            <el-input v-model="formData.model.shuoming" placeholder="请输入" clearable></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row type="flex" :justify="'end'">
        <el-button @click="search" round> 保存 </el-button>
      </el-row>
    </el-form>
  </el-dialog>
</template>

<script>
  export default {
    props: {
      showFurther: {
        type: Boolean,
        default: false,
      },
      title:{
        type:String
      }
    },
    data() {
      return {
        formData: {
          model: {
            shixiang: '',
            chengben: 0,
            fukuan: '',
            seeHouseTime: '',
            shuoming: '',
          },
          rules: {
            // recordStatus: [{ required: true, message: '请选择', trigger: 'change' }],
            // source: [{ required: true, message: '请选择', trigger: 'change' }],
          },
        },
        shixiangList: [],
        fukuanList: [],
      };
    },
    mounted() {
    },
    methods: {
      // 取消
      closeFurther() {
        this.$emit('close-dialog', false);
      },
      // 确定
      search() {
        this.$refs.form.validate(async isOK => {
          if (isOK) {
            await followOpportunity(this.formData.model);
            this.$message.success('保存成功');
            this.closeFurther();
          } else {
            return false;
          }
        });
      },
    },
  };
</script>

<style lang="scss" scoped>
  ::v-deep .el-dialog {
    .el-dialog__header {
      background: #444444;
    }
  }
  ::v-deep .el-button.is-round {
    background-color: #444444;
    color: #fff;
  }
  .el-col {
    height: 50px;
  }
  .addSpan {
    color: #33b5ff;
  }
  .textSpan {
    color: #bf4747;
  }
</style>
